<template>
  <view class="container">
    <view class="header">
      <text class="title">健农进销存</text>
    </view>
    <view class="form-container">
      <view class="form-item">
        <input type="text" placeholder="输入账号" style="width: 95%;" v-model = 'account'/>
      </view>
      <view class="form-item">
        <input type="password" placeholder="输入您的密码"  style="width: 95%;" v-model = 'password'/>
      </view>
      <view class="form-item">
        <input type="password" placeholder="请重复输入你的密码"  style="width: 95%;" v-model = 'confirmPassword'/>
      </view>
      <button class="register-button" @click="register">注册</button>
      <view class="link-container">
        <text class="login-link" @click = "toLogin">已有账号，去登录</text>
      </view>
    </view>
  </view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import { config } from '../../config';

// 账号和密码的响应式数据
const account = ref('');
const password = ref('');
const confirmPassword = ref('');

let Regist = reactive({
	accouny:'',
	password:'',
	ip:''
})

// 注册方法
async function register() {
	
	if(account.value === '' || password.value === '' || confirmPassword.value === ''){
		uni.showToast({
		  title: '请填写所有字段',
		  icon: 'error'
		});
		return ;
	}
	
  if (password.value !== confirmPassword.value) {
    uni.showToast({
      title: '两次输入的密码不一致',
      icon: 'none'
    });
    return;
  }
  // 这里添加注册逻辑
  console.log('注册账号:', account.value);
  console.log('密码:', password.value);
  // 显示注册成功的提示
  
  Regist.accouny = account.value
  Regist.password = password.value
  
  uni.request({
  	url:`${config.baseURL}/User/Rigist`,
	method:'POST',
	data:Regist,
	header: {
		'content-type': 'application/json' // 设置请求头为 JSON
	},
	success:(res)=>{
		if(res.data.data === '1'){
			uni.showToast({
			  title: '注册成功，请登录',
			  icon: 'error'
			});
		}
		else if(res.data.data === '0'){
			uni.showToast({
			  title: '系统繁忙～',
			  icon: 'error'
			});
		}
		else if(res.data.data === 'error'){
			uni.showToast({
			  title: '该用户名已存在',
			  icon: 'error'
			});
		}
	},
	fail:(err)=>{
		uni.showToast({
		  title: '严重错误'+err.errMsg,
		  icon: 'error'
		});
	}
  })
}

function toLogin(){
	uni.navigateTo({
		url:'/pages/index/index'
	})
}
</script>

<style scoped>
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: #f2f2f2;
}

.header {
  margin-bottom: 40px;
}

.title {
  font-size: 35px;
  font-weight: bold;
  color: #333;
}

.form-container {
  width: 90%;
  max-width: 300px;
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.form-item {
  margin-bottom: 15px;
}

.form-item input {
  width: 100%;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.register-button {
  width: 100%;
  background-color: #3b82f6;
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
  height: 40px;
  margin-top: 10px;
}

.link-container {
  margin-top: 10px;
  text-align: center;
  font-size: 14px;
  color: #666;
}

.login-link {
  cursor: pointer;
  color: #3b82f6;
}
</style>
